<!DOCTYPE html>
<!-- sheetjs (C) SheetJS https://sheetjs.com -->
<!-- vim: set ts=2: -->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="robots" content="noindex"/>
<title>statistic best</title>
<style>
  #drop{
    border:2px dashed #bbb;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    padding:25px;
    text-align:center;
    font:20pt bold,"Vollkorn";
    color:#00AFBB;
    background-color:#ddd;
    margin-left: 10px;
    margin-right: 10px;
  }
</style>
<!-- x-spreadsheet stylesheet -->
<link rel="stylesheet" href="https://unpkg.com/x-data-spreadsheet/dist/xspreadsheet.css"/>

</head>
<body>
    <div id="drop">Drop a spreadsheet file here to see sheet data</div>
    <div style="text-align:center; padding:10px">
      <input type="file" value="Click to Choose a File" name="xlfile" id="xlf" />
      &rarr;
      <input type="button" value="ANOVA" onclick="do_stat()" id="stat" disabled/>
    </div>
  <div id="htmlout"></div>
  <div style="text-align:center;display:none;">
    <input type="submit" value="Export to XLSX!" id="xport" onclick="export_xlsx();">
  </div>

  <script src="https://cdn.jsdelivr.net/npm/danfojs@1.1.2/lib/bundle.min.js"></script>
  <script src="https://unpkg.com/x-data-spreadsheet/dist/xspreadsheet.js"></script>
  <script src="https://cdn.sheetjs.com/xlsx-latest/package/dist/shim.min.js"></script>
  <script src="https://cdn.sheetjs.com/xlsx-latest/package/dist/xlsx.full.min.js"></script>
  <script src="https://cdn.sheetjs.com/xspreadsheet/xlsxspread.min.js"></script>
  <script>
    function ws_to_df(ws) {
      const aoo = XLSX.utils.sheet_to_json(ws);
      return new dfd.DataFrame(aoo);
    }

    /* data frame */
    var df_ = null; 

    /*jshint browser:true */
    /* eslint-env browser */
    /* eslint no-use-before-define:0 */
    /*global Uint8Array, Uint16Array, ArrayBuffer */
    /*global XLSX */
    
    var HTMLOUT = document.getElementById('htmlout');
    var xspr = x_spreadsheet(HTMLOUT);

    HTMLOUT.style.height = (window.innerHeight - 400) + "px";
    HTMLOUT.style.width = (window.innerWidth - 50) + "px";

    var process_wb = (function() {
    var XPORT = document.getElementById('xport');

      return function process_wb(wb) {
        /* convert to x-spreadsheet form */
        var data = stox(wb);
        console.log(data);
        /* update x-spreadsheet */
        xspr.loadData(data);
        XPORT.disabled = false;

        if(typeof console !== 'undefined') console.log("output", new Date());
      };
    })();

    var do_file = (function() {
      return function do_file(files) {
      var f = files[0];
      var reader = new FileReader();
      reader.onload = function(e) {
        if(typeof console !== 'undefined') console.log("onload", new Date());
        var data = e.target.result;
        process_wb(XLSX.read(data, {dense: true}));
      };
      reader.readAsArrayBuffer(f);
      };
    })();

    (function() {
      var drop = document.getElementById('drop');
      if(!drop.addEventListener) return;

      function handleDrop(e) {
        e.stopPropagation();
        e.preventDefault();
        do_file(e.dataTransfer.files);
      }

      function handleDragover(e) {
        e.stopPropagation();
        e.preventDefault();
        e.dataTransfer.dropEffect = 'copy';
      }

      drop.addEventListener('dragenter', handleDragover, false);
      drop.addEventListener('dragover', handleDragover, false);
      drop.addEventListener('drop', handleDrop, false);
    })();

    (function() {
      var xlf = document.getElementById('xlf');
      if(!xlf.addEventListener) return;
      function handleFile(e) { do_file(e.target.files); }
      xlf.addEventListener('change', handleFile, false);
    })();

/*
    (function() {
      try {
      fetch("https://docs.sheetjs.com/pres.numbers")
        .then(function(res) { return res.arrayBuffer(); })
        .then(function(ab) { process_wb(XLSX.read(ab)); });
      } catch(e) {}
    })();
*/
    function export_xlsx() {
      var new_wb = xtos(xspr.getData());

      /* write file and trigger a download */
      XLSX.writeFile(new_wb, 'data-export.xlsx', {});
    }
  </script>
  <script src='https://unpkg.com/simple-statistics@7.8.8/dist/simple-statistics.min.js'></script>
  <script src='https://cdn.jsdelivr.net/npm/jstat@1.9.6/dist/jstat.min.js'></script>
  <script>
    document.getElementById("stat").disabled = false;
    function do_stat() {
      var wb = xtos(xspr.getData());
      df_ = ws_to_df(wb.Sheets[wb.SheetNames[0]]);
      res = jStat(df_.$dataIncolumnFormat).anovaftes()
      console.log(res)
    }
  </script>
</body>
</html>
